<template>
  <a-modal title="购货方选择(可通过双击行选择)" :width="1000" :visible="visible" :confirmLoading="loading" @ok="handleSubmit" @cancel="handleCancel">
    <f-search-form :more="false" @searchHandler="searchHandler">
      <f-search-form-item label="客户名称" name="customName"/>
    </f-search-form>
    <f-table ref="table" rowKey="customId" @dblclick="dblclick" :columns="columns" :multiple="false" :showRadio="true" :operator="operator" :params="queryParam" :api="api.custom" @onSelectChange="onSelectChange">
    </f-table>
    <custom-drawer ref="drawer"></custom-drawer>
  </a-modal>
</template>
<script>
  import api from './js/api'
  import CustomDrawer from '@/views/module/business/custom/custom_drawer'

  export default {
    name: 'SelectCustomModal',
    props: {},
    data() {
      let operator = []
      operator.push({
        name: '添加',
        icon: 'plus',
        that: this,
        handler: function(table, that) {
          that.$refs.drawer.showDrawer()
        }
      })
      return {
        refs: this.$refs,
        api: Object.assign(api, this.api),
        loading: false,
        visible: false,
        selectedRowKeys: [],
        selectedRows: [],
        //列表初始化查询参数
        queryParam: {},

        // 表头
        columns: [
          {
            title: '客户名称',
            align: 'center',
            dataIndex: 'customName'
          },
          {
            title: '联系人',
            align: 'center',
            dataIndex: 'linkMan'
          },
          {
            title: '联系电话',
            align: 'center',
            dataIndex: 'telephone'
          },
          {
            title: '账套',
            align: 'center',
            dataIndex: 'companyName'
          },
          {
            title: '机构',
            align: 'center',
            dataIndex: 'organizationName'
          },
          {
            title: '收件人',
            align: 'center',
            dataIndex: 'invoiceLinkMan'
          },
          {
            title: '收件人电话',
            align: 'center',
            dataIndex: 'invoiceTel'
          }
        ],
        operator: operator
      }
    },
    methods: {
      open() {
        this.visible = true
        this.selectedRowKeys = []
        this.selectedRows = []
      },
      close() {
        this.$emit('close')
        this.visible = false
      },
      handleCancel() {
        this.close()
      },
      dblclick(record,event){
        let selectedRowKeys=[];
        let selectedRows=[];
        selectedRowKeys.push(record.customId);
        selectedRows.push(record);
        this.$emit('onSelectChange', selectedRowKeys, selectedRows)
        this.close()
      },
      handleSubmit() {
        this.$emit('onSelectChange', this.selectedRowKeys, this.selectedRows)
        this.close()
      },
      onSelectChange(selectedRowKeys, selectedRows) {
        this.selectedRowKeys = selectedRowKeys
        this.selectedRows = selectedRows
      }
    },
    created() {
    },
    components: { CustomDrawer }
  }
</script>

<style scoped lang="less" rel="stylesheet/less">

</style>
